{% extends "base.html" %}

{% load table_row_highlight %}

{% block extrahead %}
    <script language="JavaScript" type="text/javascript">
		var in_ajax = 0;
		var previous_project;
		var previous_time;
		
		//---------------------------------------------------------------------
	    // 
	    function ShowProjectDetails(project_id) {
	    	
	    	var toggle = $("#detail_"+project_id).html();
	    	
	    	if (toggle != "") {
	    		$("#detail_"+project_id).html("");
	    		in_ajax = 0;
	    		return;
	    	}
	    
	    	if (in_ajax != 1) 
            {
                in_ajax = 1;
                $.post('/project_detail/', {"project_id": project_id}, function(data){ $("#detail_"+project_id).html(data); in_ajax = 0;});
        	}
	    }
	    
	    //-----------------------------------------------------------------------------
		// 
		function LoadProject() {
			var x = document.getElementById('project_filter').selectedIndex;
			var project_id = document.getElementById('project_filter').options[x].value;
			
			//var y = document.getElementById('time_filter').selectedIndex;
			//var time_filter = document.getElementById('time_filter').options[y].value;
			var time_filter = null;
			 
			if ((in_ajax != 1) && ((project_id != previous_project)) || (time_filter != previous_time) ) {
				in_ajax = 1;
				$.post('/achievements_ajax/', {"filter": project_id, "time": time_filter}, function(data){ $("#achievements").html(data); in_ajax = 0;});
    		}
    
    		previous_project = project_id;
    		previous_time = time_filter;
		}

		$(function() {
			LoadProject();
			setInterval("LoadProject()", 2000);
	    });
    </script>
    
{% endblock %}

{% block content %}
	<!-- <div class="form_layer"> -->
		<h1 class="help_header">
		My achievements
		</h1>
		
		<p class="about help_text">
		Show achivements:
		<select id="project_filter" style="width:160px;font-size:9px">
			<option value="any">Without filtering</option>
			<option value="">&nbsp;&nbsp;&nbsp;&nbsp;Simple tasks</option>
			{% for project in projects %}
			<option value="{{project.id}}">&nbsp;&nbsp;&nbsp;&nbsp;{{project.name}}</option>
			{% endfor %}
		</select>
		<!-- 
		<select id="time_filter" style="width:100px;font-size:9px">
			<option value="any">Any time</option>
			<option value="last_year">&nbsp;&nbsp;&nbsp;&nbsp;Last year</option>
			<option value="last_month">&nbsp;&nbsp;&nbsp;&nbsp;Last month</option>
		</select>
		 -->
		</p>
		
		<div id="achievements">
		</div>

	<!-- </div> -->
{% endblock %}